{% extends "AdminSalarySysMenu/MainMain.html" %}
{% load staticfiles %}

{% block bodyhead %}

<body class="hold-transition skin-green-light sidebar-mini" onload="initPage()">

  {% endblock %}

  {% block Page_ReSetPWD_2Methods %}
  <li class="active">
    <a href="{% url 'GZGL:Page_ReSetPWD_2Methods' %}">
      <i class="fa fa-pencil-square-o"></i><span> Admin密码修改</span>
      <span class="pull-right-container">
        <i class="fa fa-angle-right pull-right"></i>
      </span>
    </a>
  </li>
  {% endblock %}

  {% block content %}
  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1>
        账户信息设置
        <small>修改您的密码</small>
      </h1>
      <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> Level</a></li>
        <li class="active">Here</li>
      </ol>

    </section>

    <!-- Main content -->
    <section class="content container-fluid">
      <div class="col-md-10">
        <!-- Validation wizard -->
        <div class="box box-default">
          <div class="box-header with-border">
            <h4 class="box-title">修改您的密码</h4>
            <h6 class="box-subtitle">您可以通过下方的步骤来修改您的密码</h6>

          </div>
          <!-- /.box-header -->
          <div class="box-body form-element">
            <div class="row text-center" style="margin:20px;">
              <div class="col-xs-3"><button type="button" class="btn btn-rounded btn-primary fs-17 m-l-2" id="first1">1.
                  选择验证方式</button></div>

              <div class="col-xs-3"> <button type="button" class="btn btn-rounded btn-outline btn-primary fs-17"
                  id="second2" disabled>2. 身份验证</button> </div>
              <div class="col-xs-3"> <button type="button" class="btn btn-rounded btn-outline btn-primary fs-17"
                  id="third3" disabled>3. 修改您的密码</button> </div>
              <div class="col-xs-3"> <button type="button" class="btn btn-rounded btn-outline btn-primary fs-17"
                  id="fourth4" disabled>4. 修改成功</button> </div>
            </div>


            <!-- Step 1 -->
            <section style="background-color:#f4f6f9">
              <input id="user_id_id2" value="{{here.staff_id}}" type="hidden">
              <input id="user_id_id" value="{{here.staff_id}}" type="hidden">
              <input id="typereset" value="page" type="hidden">
              <input id="emailemail" value="" type="hidden">
              <div class="row text-center" style="padding:20px;" id="wayChooseWay">
                <div class="col-md-12">
                  <input name="checkMethod" type="radio" class="with-gap radio-col-maroon" id="radio_sendemail"
                    value="sendemail" />
                  <label for="radio_sendemail" class="fs-17">通过发送邮箱验证码来验证身份</label>
                  <input name="checkMethod" type="radio" class="with-gap radio-col-maroon" id="radio_pwd" value="pwd" />
                  <label for="radio_pwd" class="fs-17">通过原密码来验证身份</label>
                </div>
              </div>
              <div class="row fs-21 text-center " style="margin:10px;" id="wayShowContext">
                <div class="col-md-12 ">
                  <div class="form-group bg-success">
                    <label style="padding:15px;">您希望通过什么样的方式修改您的密码？</label>
                  </div>
                </div>
              </div>

              <div class="row" style="display:none;" id="wayPWD">
                <div class="col-md-12 form-element text-center" style="padding:17px;">
                  <input class="form-control input-lg w-66 text-center" type="password" id="oldpwd" placeholder="请输入您的原密码">
                </div>
                <div class="col-md-12 form-element text-center">
                  <span class="fa fa-remove fs-17" style="color:#992168;display: none;" id="error_info_oldPWD"></span>
                </div>
              </div>
              <div class="row"  style="display:none;" id="newPWDInput" >
                <div class="col-md-12 form-element text-center" style="padding:17px;">
                  <input class="form-control input-lg w-66 text-center" type="password" id="inputPassword2" placeholder="请输入您的新密码">
                </div>
                <div class="col-md-12 form-element text-center" style="padding:17px;">
                  <input class="form-control input-lg w-66 text-center" type="password" id="inputConfirmpassword2" onkeyup="checkpassword2()" placeholder="请再次输入您的新密码">
                </div>
                <div class="col-md-12 form-element text-center fs-17" style="display:none" id="inputErrorPWDUnSame" >
                  <label class="control-label" for="inputError" style="color:#992168">
                    <i class="fa fa-remove"></i> 密码输入不一致，请检查后重新输入。</label></div>
              </div>
              <div class="row w-66 text-center m-b-7"  style="display:none; padding: 17px;" id="setPWDSuccess" >
                <div class="col-md-12 form-element text-center fs-21">
                  <label class="control-label text-success" for="inputError">
                    <i class="fa fa-check"></i> 您的密码修改完成，请牢记您的新密码。</label></div>
              </div>

              <div class="row" style="display:none;" id="wayemail">
                <div class="col-md-12 form-element text-center" style="padding:17px;">
                  <input class="form-control input-lg w-66 text-center" type="email" id="idemail" placeholder="请输入您的完整的 Email 账号">
                </div>
                <div class="col-md-12 form-element text-center">
                  <span class="fa fa-remove fs-17" style="color:#992168;display: none;" id="error_info_Email"></span>
                </div>
              </div>

              <div class="row" style="display:none;" id="EmailCodeInput">
                <div class="col-md-12 form-element text-center" style="padding:17px;">
                  <input class="form-control input-lg w-66 text-center" type="text" id="idcode" placeholder="您填写接收到的身份验证码" onkeyup="toUpperCase(this);" required>
                </div>
                <div class="col-md-12 form-element text-center m-b-7">
                  <span class="fa fa-remove fs-17" style="color:#992168;display: none;" id="error_info_SendEmail"></span>
                </div>
                <div class="col-md-12 form-element text-center">
                  <span class="fa fa-warning fs-17" style="color:#f39c12;" id="warning_info_SendEmail">请稍等，正在为您发送邮件。</span>
                </div>
                <div class="col-md-12 form-element text-center">
                  <span class="fa fa-check fs-17" style="color:#259921;display: none;" id="right_info_SendEmail"></span>
                </div>
              </div>


            </section>
            <button type="button" class="btn btn-outline btn-rounded btn-success pull-right m-l-7 m-t-15"
              style="display: none" id="checkOldPWDBtn">验证我的密码</button>
            <button type="button" class="btn btn-rounded btn-success pull-right m-l-7 m-t-15"
              style="display: none" id="setNewPWDBtn" disabled>确认我的新密码</button>
            <button type="button" class="btn btn-outline btn-rounded btn-success pull-right m-l-7 m-t-15"
              style="display: none" id="checkEmailBtn">验证我的Email账户</button>
              <button type="button" class="btn btn-rounded btn-success pull-right m-l-7 m-t-15"
              style="display: none" id="checkCodeBtn">验证我的身份验证代码</button>

          </div>

        </div>
        <!-- /.box-body -->
      </div>
      <!-- /.box -->

  </div>


  </section>
  <!-- /.content -->
  </div>
  <!-- /.content-wrapper -->

  {% endblock %}
  {% block JSAnotherFile %}
  <!-- REQUIRED JS SCRIPTS -->
  <script src="{% static 'js/Signin.js'%}" type="text/javascript"></script>

  <script src="{% static 'bower_components/datatable/datatables.min.js'%}"></script>

  <script src="{% static 'js/data-table.js'%}"></script>
  <!-- Sweet-Alert  -->
  <script src="{% static 'bower_components/sweetalert/sweetalert.min.js'%}"></script>
  <script src="{% static 'js/Sweetalert_confirm.js'%}"></script>

  <!-- validate  -->
  <script src="{% static 'bower_components/jquery-validation-1.17.0/dist/jquery.validate.min.js'%}"></script>

  <!-- steps  -->
  <script src="{% static 'bower_components/jquery-steps-master/build/jquery.steps.js'%}"></script>

  <!-- wizard  -->
  <script src="{% static 'js/steps.js'%}"></script>

  {% endblock %}